<template>
  <div class="test-page">
    <h1>API 测试页面</h1>
    <van-button @click="testImport">测试导入</van-button>
    <van-button @click="testAPI">测试 API 调用</van-button>
    <div v-if="result">
      <pre>{{ JSON.stringify(result, null, 2) }}</pre>
    </div>
  </div>
</template>

<script setup>
import { ref } from 'vue'
import { 
  getPaymentList, 
  getPaymentStats, 
  confirmPayment, 
  rejectPayment 
} from '@/api/payment-confirm'

const result = ref(null)

const testImport = () => {
  try {
    console.log('getPaymentList:', getPaymentList)
    console.log('getPaymentStats:', getPaymentStats)
    console.log('confirmPayment:', confirmPayment)
    console.log('rejectPayment:', rejectPayment)
    result.value = { message: '导入成功', functions: ['getPaymentList', 'getPaymentStats', 'confirmPayment', 'rejectPayment'] }
  } catch (error) {
    console.error('导入失败:', error)
    result.value = { error: error.message }
  }
}

const testAPI = async () => {
  try {
    const listResult = await getPaymentList({ perspective: 'seller', status: 'pending', page: 1, pageSize: 5 })
    const statsResult = await getPaymentStats({ perspective: 'seller' })
    result.value = {
      list: listResult,
      stats: statsResult
    }
  } catch (error) {
    console.error('API 调用失败:', error)
    result.value = { error: error.message }
  }
}
</script>

<style scoped>
.test-page {
  padding: 20px;
}

.van-button {
  margin: 10px;
}

pre {
  background: #f5f5f5;
  padding: 10px;
  border-radius: 4px;
  overflow-x: auto;
}
</style> 